<template>
	<view style="padding-top: 20upx;">
		<view class="webkit list">
			<view class="title">手机号</view>
			<input type="number" :value="mobile" @input="mobileInput" class="flex" />
		</view>
		<view class="webkit list">
			<view class="title">图形验证码</view>
			<input type="text" @input="imgcodeInput" class="flex" />
			<image class="inputright" @click="changeImg" :src="'http://suhua.suzhanxue.com/web/index.php?c=utility&a=code&r='+timestamp"></image>
		</view>
		<view class="webkit list">
			<view class="title">验证码</view>
			<input type="number" @input="verify" class="flex" />
			<button class="inputright" type="default" :disabled="codebtn" @click="getcode">{{codetext}}</button>
		</view>
		<view class="webkit list">
			<view class="title">登录密码</view>
			<input type="text" password  @input="pwdInput" class="flex" />
		</view>
		<view class="webkit list">
			<view class="title">确认密码</view>
			<input type="text" password  @input="pwd2Input" class="flex" />
		</view>
		<view style="padding: 0 24upx;">
			<button type="primary" style="background-color: #000;margin-top: 20upx;" @click="submit" :loading="loading">确认修改</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				timestamp:'',
				codetext: '获取验证码',
				loading: false,
				codebtn: false,
				codenum: 60,
				mobile:'',
				imgcode:'',
				pwd:'',
				pwd1:'',
				verifycode:'',
				res:[],
				user_id:'',
			};
		},
		onLoad:function(){
			uni.showLoading()
			uni.getStorage({
				key: 'openid',
				success: (res) => {
					this.openid = res.data
					this.setAjax()
				},
				fail: () => {
					uni.navigateTo({
						url: '../../login/login'
					});
				}
			});
		},
		methods:{
			setAjax(){
				uni.request({
					url: 'http://suhua.suzhanxue.com/app/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile& r=member.bind&openid='+this.openid+'&app=1',
					success: res => {
						uni.hideLoading()
						this.mobile = res.data.member.mobile
					},
					fail: () => {},
					complete: () => {}
				});
			},
			mobileInput(e) {
				this.mobile = e.target.value
			},
			imgcodeInput(e) {
				this.imgcode = e.target.value
			},
			pwd2Input(e) {
				this.pwd1 = e.target.value
			},
			pwdInput(e) {
				this.pwd = e.target.value
			},
			verify(e) {
				this.verifycode = e.target.value
			},
			changeImg() {
				var timestamp = (new Date()).getTime();
				this.timestamp = timestamp
			},
			getcode(){
				if (this.mobile == "") {
					uni.showToast({
						title: '请输入手机号',
						icon: "none"
					});
				} else if (this.imgcode == "") {
					uni.showToast({
						title: '请输入图形验证码',
						icon: "none"
					});
				} else {
					uni.request({
						url: 'http://suhua.suzhanxue.com/app/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=account.verifycode&app=1',
						method: 'POST',
						data: {
							mobile: this.mobile,
							temp: 'sms_bind',
							imgcode: this.imgcode
						},
						header: {
							'Content-Type': 'application/x-www-form-urlencoded'
						},
						success: res => {
							uni.showToast({
								title: res.data.result.message,
								icon: "none"
							});
							if (res.data.status == 1) {
								this.codebtn = true
								var codetexts = setInterval(() => {
									this.codenum = this.codenum - 1
									this.codetext = this.codenum + 's'
								}, 1000)
								setTimeout(() => {
									this.codebtn = false
									clearInterval(codetexts);
									this.codetext = '重新发送'
								}, 60000)
							}
						},
						fail: () => {},
						complete: () => {}
					});
				}
			},
			submit(){
				if (this.mobile == "") {
					uni.showToast({
						title: '请输入手机号',
						icon: "none"
					});
				} else if (this.pwd == "") {
					uni.showToast({
						title: '请输入登录密码',
						icon: "none"
					});
				} else if (this.pwd1 == "") {
					uni.showToast({
						title: '请确认登录密码',
						icon: "none"
					});
				} else if (this.verifycode == "") {
					uni.showToast({
						title: '请输入短信验证码',
						icon: "none"
					});
				} else {
					this.loading = true
					uni.request({
						url: 'http://suhua.suzhanxue.com/app/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=member.bind&app=1',
						method: 'POST',
						data: {
							mobile: this.mobile,
							pwd: this.pwd,
							pwd1: this.pwd1,
							verifycode: this.verifycode,
							openid:this.openid,
						},
						header: {
							'Content-Type': 'application/x-www-form-urlencoded'
						},
						success: res => {
							this.loading = false
							if (res.data.status == -1) {
								uni.showModal({
									content: res.data.result.message,
									confirmText: "确定",
									cancelText: "取消",
									success: res => {
										if(res.confirm){
											uni.request({
												url: 'http://suhua.suzhanxue.com/app/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=member.bind&app=1',
												method: 'POST',
												data: {
													mobile: this.mobile,
													pwd: this.pwd,
													pwd1: this.pwd1,
													verifycode: this.verifycode,
													openid:this.openid,
													confirm:1
												},
												header: {
													'Content-Type': 'application/x-www-form-urlencoded'
												},
												success: res => {
													uni.showToast({
														title: res.data.result.message,
														icon: "none"
													});
													if(res.data.status == 1){
														uni.navigateBack();
													}
												},
												fail: () => {},
												complete: () => {}
											});
										}
									},
								})
							}else{
								uni.showToast({
									title: res.data.result.message,
									icon: "none"
								});
								if(res.data.status == 1){
									uni.navigateBack();
								}
							}
						},
						fail: () => {},
						complete: () => {}
					});
				}
			},
		},
	}
</script>

<style>.list{padding:16upx 24upx;background:#fff;position:relative;}.list:last-child:after{display:none;}.list:after{content:" ";position:absolute;left:20upx;right:20upx;bottom:-2upx;height:2upx;border-top:2upx solid #ebebeb;color:#D9D9D9;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleY(0.5);-ms-transform:scaleY(0.5);transform:scaleY(0.5);}.list .title{width:150upx;line-height:50upx;color:#666;}.list .flex{line-height:50upx;color:#666;padding-left:24upx;}.inputright{width:200upx;height:52upx;}button.inputright{line-height:48upx;font-size:24upx;background:transparent;border:2upx solid #333;}</style>